<style>
    .show{display: inherit}
    .hide{display: none}
    table tr td,table tr th{width: 5%}
    .layui-btn{margin-right: 10px}
    .layui-table-cell {overflow-x: hidden;overflow: inherit;line-height:22px; }
	.layui-table img{max-height:50px;}

</style>
<div class="fixed-bar" style="clear:both;">
    <form class="layui-form layui-form-pane fixed-bar-form" action="{:url('',['status' => $status,'process_stage' => $process_stage])}" method="get" id="hisi-table-search">
    	<input type="hidden" name="process_stage" value="{:$process_stage}" />
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">订单号</label>
                <div class="layui-input-inline">
                    <input type="text" name="client_ordernum" lay-verify="" placeholder="输入订单号" class="layui-input">
                </div>
            </div>
            <div class="layui-inline removeStat">
                <label class="layui-form-label">SKU</label>
                <div class="layui-input-inline">
                    <input type="text" name="sku" lay-verify="" placeholder="输入SKU" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">所属工厂</label>
                <div class="layui-input-inline">
                    {:Form::select('factory_id', '', $factoryKV, '', '')}
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label ">完成日期</label>
                <div class="layui-input-inline">
                    <input type="text" name="create_date_range" readonly="" id="create_date_range" lay-verify="" placeholder="选择完成日期" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <button type="submit" id="seacher" class="layui-btn" lay-submit="" lay-filter="demo1">搜索</button>
                <!--                <button type="button" class="layui-btn layui-btn-primary hisi-export show">导出</button>-->
            </div>
        </div>
    </form>
</div>
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief" style="clear:both;">
    <ul class="layui-tab-title" id="vue_tab_content">
        <li class="layui-this"><a onclick="statCli(1)" href="#">待审核（<span class="red bold stat-num-1">{{ statData_1 }}</span>条）</a></li>
        <li><a onclick="statCli(2)" href="#">已审核（<span class="red bold stat-num-2">{{ statData_2 }}</span>条）</a></li>
    </ul>
    <div class="layui-tab-content">
        <table id="dataTable" lay-filter="demoEvent"></table>
    </div>
</div>



{include file="system@block/layui" /}

<script type="text/html" id="skuTpl">
    <span class="copy-item">{{ d.client_ordernum }}</span> <br>
    <span class="copy-item">{{ d.sku }}</span>
</script>
<script type="text/html" id="picTpl">
    <span class="lay-pic-container" src="{{d.pic_res}}">
        <img src="{{d.pic_res}}" class="lay-pic">
    </span>
</script>
<script type="text/html" id="caiChuangTypeTpl">
    {{# if (d.caichuang_type=='1') { }}
    手工裁剪
    {{# } else { }}
    电脑裁剪
    {{# } }}
</script>
<script type="text/html" title="操作按钮模板" id="buttonTpl">
    <a href="javascript:void(0)" data-json='{{d.process_name_json}}' data-id="{{ d.order_id }}" data-url="{:url('doEditStatementsProcessPrice')}?order_id={{ d.order_id }}"
	ordernum="{{d.client_ordernum}}" class="layui-btn layui-btn-danger layui-btn-sm edit-processPrice">修改单价</a>
</script>
<script type="text/html" id="toolbar">
    <div class="layui-btn-group fr">
        <a data-href="{:url('setStatementsSettle')}?process_stage=1&status=2" class=" layui-btn layui-btn-primary layui-btn-sm j-page-btns confirm layui-icon back">审核</a>&nbsp;&nbsp;
		<a data-href="{:url('setStatementsSettle')}?process_stage=1&status=0" class=" layui-btn layui-btn-primary layui-btn-sm j-page-btns confirm layui-icon back">驳回</a>&nbsp;&nbsp;
    </div>
</script>

<div id="defectiveTpl" class="hide">
	<form class="layui-form layui-form-pane" lay-verify="" action="" method="get">
	<div class="layui-form-item pt20 pl20">
		{{#  for(var i in d.list){ }}
		<div class="layui-inline">
			<label class="layui-form-label">{{ d.list[i].process_name }}</label>
			<div class="layui-input-inline">
            	<input type="hidden" name="process_name[]" value="{{ d.list[i].process_name }}" />
                <input type="hidden" name="old_process_price[]" value="{{ d.list[i].process_price }}" />
				<input type="text" name="process_price[]" value="{{ d.list[i].process_price }}" lay-verify="number|required" placeholder="输入单价" class="layui-input">
			</div>
		</div>
		{{#  } }}
		
		<input type="hidden" name="order_id" value="{{ d.order_id }}">
		<input type="hidden" name="url" value="{{ d.url }}">
		<div class="layui-inline fr">
          <button class="layui-btn" lay-submit lay-filter="stock-defective" >确认</button>
        </div>
	</div>
	</form>
</div>

<script src="__PUBLIC_JS__/jquery.2.1.4.min.js?v={:config('hisiphp.version')}"></script>
<script src="__PUBLIC_JS__/xm-select/dist/xm-select.js?v={:config('hisiphp.version')}"></script>
<script src="__PUBLIC_JS__/vue@3.2.26/dist/vue.global.js"></script>
<script type="text/javascript">
    //#vue_tab_content
    const allContent = {
        data() {
            return {
                statData_1:0,
            statData_2:0
        }
        }
    }
    const vm=Vue.createApp(allContent).mount('#vue_tab_content');
    layui.use(['table', 'laydate', 'form', 'laytpl','tool','layer','laytpl'], function() {
        var $ = layui.jquery;
        var table = layui.table;
		var laytpl = layui.laytpl;
        var laydate = layui.laydate;
        var form = layui.form;
        var layer = layui.layer;
        var initialize=0,second_initialize=0,first_init=0,changetab=0;
        laydate.render({
            elem: '#create_date_range'
            ,range: '~'
            ,theme: 'molv'
            ,mark: {'{:$today}':''}
            ,change: function(value, date, endDate){
                $('#create_date_range').val(value);
                $('#layui-laydate1').remove();//关闭面板
            }
        });

        window.status=0;
        window.statCli = function(status) {
            var url='{:url()}?status='+status;
            window.status=status;
            $("#hisi-table-search").attr('action',url);
            $("#seacher").click();
            changetab=1;
        }
		
		// 工价调整
		var layerDefective = null;
		$(document).on('click','.edit-processPrice',function(){
			var orderId = $(this).attr('data-id');
			var url = $(this).attr('data-url');
			var json = $(this).attr('data-json');
			var ordernum=$(this).attr("ordernum");
			var d = [];
			d['list'] = eval("(" + json+ ")");
			d['url'] = url;
			d['order_id'] = orderId;
			var content = laytpl($('#defectiveTpl').html()).render(d);
			layerDefective = layer.open({
				type: 1
				,shade: 0
				,offset: '100px'
				,anim: parseInt(Math.random()*(6+1),10)
				,skin:'layui-layer-molv'
				,title:'修改订单工价 '+ ordernum
				,content: content
			});
		});
		
		form.on('submit(stock-defective)', function (data) {
			console.log(data.field);
			var url = data.field.url;
			$.ajax({
	 		   type: "POST",
	 		   url: url,
	 		   data: data.field,
	 		   dataType:"json",
	 		   success: function(res){
	 			  if (res.code == 1) {
	 				 $('#defectiveTpl form')[0].reset();
	 				 layer.close(layerDefective);
					 layer.msg(res.msg, {icon: 1,end:function(){opTable.reload();}});
				  } else {
					 layer.msg(res.msg, {icon: 2,anim: 6});
				  }
	 		   }
	 		});
			
			return false;
		});

        var opTable =table.render({
            elem: '#dataTable'
            ,url: '{:url("", ["status" => $status,"process_stage" => $process_stage])}' //数据接口
            ,page: true //开启分页
            //,skin: 'row'
            ,even: true
            ,limit: 20
            ,limits: [20,50,100,150,200]
            ,text: {
                none : '暂无相关数据'
            }
            ,toolbar: '#toolbar'

            ,defaultToolbar: ['exports', 'print']
            ,cols: [[ //表头
                {type:'checkbox',width:50}
                ,{field: 'work_time', title: '完成时间',width:130}
				,{field: 'user_name', title: '姓名'}
                ,{field: 'skuTpl', title: '订单号/SKU', templet:'#skuTpl',width:220}
                ,{field:'pic_res',title : '图片', templet:'#picTpl',width:130}
                ,{field: 'quantity', title: '订单总数'}
				,{field: 'process_name', title: '工序'}
				,{field: 'tot_quintity', title: '加工数量'}
				,{field: 'process_price', title: '单价'}
				,{field: 'money_total', title: '金额'}
                ,{field: 'factory_name', title: '工厂'}
				,{field: 'group_name', title: '组别'}
				,{field: 'ft_name', title: '库存'}
				,{field: 'ft_name', title: '备注'}
            ]]
            ,done: function(res, curr, count){
                var data=res.data;
                var status=res.status;
                for (var i in data){
                    $('#stall-ids-'+data[i]['id']).val(data[i]['stall_id']);
                }
                layui.form.render();
                //设置 对账审核（2条/驳回0条）已审核（2条）复核账单（1条）已提交（0条）
                vm.$data.statData_1=res.needcheckCount;
                vm.$data.statData_2=res.checkedCount;
                if(status==1){
                    $('table tr').each(function(i){
                        var remove_field=['process_price2'
                        ];
                        for(var i in remove_field) {
                            var temp=$(this).find('[data-field="'+remove_field[i]+'"]').remove();
                        }
                    });
                    $('.back').show();
                }else if(status==2){
                    $('table tr').each(function(i){
                        var remove_field=['col3'];
                        for(var i in remove_field) {
                            var temp=$(this).find('[data-field="'+remove_field[i]+'"]').remove();
                        }
                    });
                    $('.back').remove();
                }
                table.on('edit(demoEvent)', function(obj){
                    var value = obj.value //得到修改后的值
                        ,d = obj.data //得到所在行所有键值
                        ,field = obj.field; //得到字段
                    var id=d.id;

                    $.ajax({
                        type: "POST",
                        url: "{:url('editUnit')}",
                        data: "id="+d.id+"&field="+field+"&value="+value,
                        dataType:"json",
                        success: function(res){
                            if (res.code == 1) {
                                layer.msg(res.msg, {icon: 1});
                            } else {
                                layer.msg(res.msg, {icon: 2,anim: 6});
                            }
                        }
                    });
                });
            }
        });

        form.on('submit(stock-defective)', function (data) {
            console.log(data.field);
            var url = data.field.url;
            $.ajax({
                type: "POST",
                url: url,
                data: data.field,
                dataType:"json",
                success: function(res){
                    if (res.code == 1) {
                        $('#defectiveTpl form')[0].reset();
                        layer.close(layerDefective);
                        layer.msg(res.msg, {icon: 1,end:function(){opTable.reload();}});
                    } else {
                        layer.msg(res.msg, {icon: 2,anim: 6});
                    }
                }
            });

            return false;
        });
    });

</script>